<template>
  <div class="demo-avatar">
    <div class="demo-avatar-block">
      <t-avatar size="small"> W </t-avatar>
      <t-avatar size="medium"> W </t-avatar>
      <t-avatar size="large"> W </t-avatar>
      <t-avatar size="100px"> W </t-avatar>
    </div>
    <div class="demo-avatar-block">
      <t-avatar shape="round" size="small"> W </t-avatar>
      <t-avatar shape="round" size="medium"> W </t-avatar>
      <t-avatar shape="round" size="large"> W </t-avatar>
      <t-avatar shape="round" size="100px"> W </t-avatar>
    </div>
  </div>
</template>

<style lang="less" scoped>
.demo-avatar {
  .demo-avatar-block:first-child {
    margin-bottom: 40px;
  }
  .t-avatar {
    margin-right: 40px;
  }
}
</style>
